import 'package:flutter/material.dart';
import 'package:event_bus/event_bus.dart';

EventBus eventBus = EventBus();

class SelectTemplet extends StatefulWidget{
    SelectTemplet({this.selectValLab,this.callback(String value,String label),this.title,this.openClose});
    final List selectValLab;
    final Function callback;
    final String title;
     bool openClose = false;
    @override
    _SelectTempletState createState() => _SelectTempletState();
}

class _SelectTempletState extends State<SelectTemplet>with SingleTickerProviderStateMixin{

    Animation<double> animation;
    AnimationController controller;

    String selectValue;
    static int lineHeight;
    int sign = 0;

    initState() {
        super.initState();
        calculateLine();
        controller = new AnimationController(duration: const Duration(milliseconds: 300), vsync: this);
        animation = new Tween(begin: 0.0, end: lineHeight.toDouble()).animate(controller)..addListener(() {setState(() {});});
        eventBus.on<SelectTemplet>().listen((SelectTemplet data){
            if(data.openClose == true){
                controller.forward();
            }else{
                controller.reverse();
            }
        });
        // print(widget.selectValLab[0]["value"]);
        
    }

    //第一遍初始化的时候，下拉的值都还没取回来，更新当值取回来的时候选中第一个，
    //sign等于1的时候，重复点开下拉框不会再重复选中第一个
    void didUpdateWidget(SelectTemplet oldWidget) {
        super.didUpdateWidget(oldWidget);
        // print(widget.selectValLab[0]["label"]);
        if(sign == 0){
            if(widget.selectValLab[0]["label"] == null){
                return;
            }else{
                selectValue = widget.selectValLab[0]["value"];
                widget.callback(widget.selectValLab[0]["value"],widget.selectValLab[0]["label"]);
                sign = 1;
            }
        }
    }

    // dispose() {
    //     // controller.dispose();
    //     super.dispose();
    // }

    void calculateLine(){
        if(widget.selectValLab.length % 3 == 0){
            lineHeight = ((widget.selectValLab.length / 3) as int)*50+70;
        }else{
            lineHeight = ((widget.selectValLab.length ~/ 3)+1)*50+70;
        }
    }

    
    Widget build(BuildContext context){
        if(widget.selectValLab.length > 0 && widget.selectValLab != null){
            return Container(
                margin: EdgeInsets.fromLTRB(2, 2, 2, 0),
                width: MediaQuery.of(context).size.width,
                padding: EdgeInsets.all(10.0),
                height: animation.value,
                decoration: BoxDecoration(
                    color: Color.fromRGBO(255, 255, 255, 1),
                    border: Border.all(width: 1.0,color: Colors.grey),
                    borderRadius: BorderRadius.circular(10.0)
                ),
                child: Column(
                    children: <Widget>[
                        Container(
                            alignment: Alignment.centerLeft,
                            padding: EdgeInsets.all(10.0),
                            child: Text(
                                widget.title.toString(),
                                style: TextStyle(
                                    fontSize: 15.0,
                                ),
                            ),
                        ),
                        Wrap(
                            alignment: WrapAlignment.start,
                            verticalDirection: VerticalDirection.down,
                            spacing: 10,
                            runSpacing: 10,
                            children: List.generate(widget.selectValLab.length, (i){
                                return GestureDetector(
                                    onTap: (){
                                        setState(() {
                                            selectValue = widget.selectValLab[i]["value"];
                                        });
                                        widget.callback(widget.selectValLab[i]["value"],widget.selectValLab[i]["label"]);
                                    },
                                    child: Container(
                                        width: (MediaQuery.of(context).size.width-60)/3,
                                        height: 40.0,
                                        alignment: Alignment.center,
                                        decoration: BoxDecoration(
                                            borderRadius: BorderRadius.circular(5),
                                            border: Border.all(color: Colors.grey, width: 1.0),
                                            color: widget.selectValLab[i]["value"] == selectValue? Color.fromRGBO(81, 126, 219, 1):Colors.white,
                                        ),
                                        child: Text(
                                            widget.selectValLab[i]["label"].toString(),
                                            style: TextStyle(
                                                color: widget.selectValLab[i]["value"] == selectValue? Colors.white:Colors.black,
                                            ),
                                        ),
                                    ),
                                );
                            }),
                        ),
                    ],
                )
            );
        }else{
            return Container(
                height: 0,
            );
        }
        
    }

}